<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import Read from './Read/index.vue'
import Write from './Write/index.vue'
import NginxFormat from './NginxFormat/index.vue'

const route = ref('')
const enterAction = ref({})

onMounted(() => {
  // 开发环境模拟utools对象
  if (!window.utools) {
    window.utools = {
      onPluginEnter: (callback) => {
        // 开发环境默认进入nginx-format功能
        setTimeout(() => {
          callback({ code: 'nginx-format', type: 'text', payload: '' })
        }, 100)
      },
      onPluginOut: (callback) => {},
      showNotification: (message) => {
        console.log('通知:', message)
        alert(message)
      },
      shellShowItemInFolder: (path) => {
        console.log('打开文件夹:', path)
      },
      getPath: (type) => {
        return type === 'downloads' ? 'C:\\Users\\Downloads' : 'C:\\'
      }
    }
  }
  
  // 开发环境模拟services对象
  if (!window.services) {
    window.services = {
      readFile: (filePath) => {
        console.log('读取文件:', filePath)
        return '# 示例Nginx配置\nserver {\nlisten 80;\nserver_name example.com;\nlocation / {\nproxy_pass http://backend;\n}\n}'
      },
      writeNginxFile: (content, fileName) => {
        console.log('保存文件:', fileName, content)
        return 'C:\\Users\\Downloads\\' + fileName
      }
    }
  }

  window.utools.onPluginEnter((action) => {
    route.value = action.code
    enterAction.value = action
  })
  window.utools.onPluginOut((isKill) => {
    route.value = ''
  })
})
</script>

<template>
  <template v-if="route === 'nginx-format'">
    <NginxFormat :enterAction="enterAction"></NginxFormat>
  </template>
  <template v-if="route === 'read'">
    <Read :enterAction="enterAction"></Read>
  </template>
  <template v-if="route === 'write'">
    <Write :enterAction="enterAction"></Write>
  </template>
</template>
